<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<meta name="viewport" content="width=device-width,initial-scale=1.0">
	<link rel="stylesheet" href="./app.css" />
</head>
<body>
<div class="name"></div>
<div class="description"></div>
<div class="flex column align-center photos">
	<img class="photo" />
</div>
<script>
			function setName(name){
				document.getElementsByClassName("name")[0].innerHTML = name;
			}

			function setDescription(desc){
				document.getElementsByClassName("description")[0].innerHTML = desc
			}

			function setImage(image){
				document.getElementsByClassName('photo')[0].src = image;
			}

			function getData(item_id,token){
				const http = new XMLHttpRequest();
				const url = "http://47.99.159.129:8090/api/productTrade/queryById/"+item_id;
				http.open("GET",url);
				http.setRequestHeader("Authorization", "Bearer " + token);
				http.send();
				http.onreadystatechange = function(e){
					if(this.readyState == 4 && this.status == 200){
						// console.log(http.responseText);
						let res = JSON.parse(http.responseText);
						setName(res.productName);
						setDescription(res.productDescription);
						setImage(res.productPictureLocation);
					}else{
						//alert(this.status);
					}
				}
			}
			function buyingItem(name, description, picture){
				setName(name);
				setDescription(description);
				setImage(picture);
			}
		</script>
</body>
</html>
